<template>
	<view class="detail">
		<view class="u-content">
			<view class="title">{{news.title}}</view>
			<view class="time">
				{{news.creationTime | timeFrom('yyyy-mm-dd')}}
			</view>
			<view class="img">
				<u-image  width="100%"  :showLoading="true" mode="widthFix":src="news.image"   ></u-image>
			</view>
				
			<u-parse :content="news.content" ></u-parse>
		</view>
		
	</view>
</template>

<script>
	import {
		singleArticle
	} from "@/api/index.js"
	export default {
		data() {
			return {
				news:{}
			}
		},
		onLoad(e) {
			console.log(e);
			this.singleArticles(e.newsid)
		},
		methods: {
			async singleArticles(e){
				const {
					data,
					status,
					msg
				} = await singleArticle({params: {newsId:e}})
				
				if(status==200){
					this.news = data
				}
			}
		}
	}
</script>

<style lang="scss">
	page{
		height: 100vh;
		background-color: #4f4a73;
	}
.detail{
	
	
	.u-content{
		width: 90%;
		background-color:#fff;
		margin: 40rpx auto 80rpx;
		padding: 20rpx;
		box-sizing: border-box;
		border-radius: 25rpx;
		.title{
			font-size: 48rpx;
			font-weight: 700;
			margin-bottom: 20rpx;
			
		}
		.time{
			margin-bottom: 20rpx;
		}
		.img{
			margin-bottom: 20rpx;
		}
	}
}
</style>
